<template>
  <basic-dialog
    :width="width"
    :title="dialogTitle"
    :visible="visible"
    :showFooter="false"
    :handleClose="closeDialog"
  >
    <CategorySelect
      v-if="associatedTypes[currentType] == 'category'"
      :notQueryClassify="notQueryClassify"
      @submitConcat="submitResults"
      @cancelConcat="closeDialog"
    />
    <BrandSelect
      v-if="associatedTypes[currentType] == 'brand'"
      @submitConcat="submitResults"
      @cancelConcat="closeDialog"
    />
    <UnitSelect
      v-if="associatedTypes[currentType] == 'unit'"
      @submitConcat="submitResults"
      @cancelConcat="closeDialog"
    />
    <MaterialSelect
      v-if="associatedTypes[currentType] == 'material'"
      @submitConcat="submitResults"
      @cancelConcat="closeDialog"
    />
  </basic-dialog>
</template>
<script>
import BasicDialog from '@/components/BasicDialog';
import CategorySelect from '../../addCode/categorySelect';
import BrandSelect from '../../addCode/brandSelect';
import UnitSelect from '../../addCode/unitSelect';
import MaterialSelect from '../../addCode/materialSelect';
export default {
  components: {
    BasicDialog,
    CategorySelect,
    BrandSelect,
    UnitSelect,
    MaterialSelect
  },
  props: {
    dialogTitle: String,
    visible: Boolean,
    currentType: {
      type: String,
      required: true
    },
    width: {
      type: String,
      default: '60%'
    },
    notQueryClassify: {
      type: Boolean,
      default: true
    }
  },
  data () {
    return {
      associatedTypes: {
        '1': 'category',
        '2': 'brand',
        '3': 'unit',
        '5': 'material'
      }
    }
  },
  methods: {
    submitResults (results) {
      this.$emit('getSelectResults', results);
      this.$emit('update:visible', false);
    },
    closeDialog () {
      this.$emit('update:visible', false);
    }
  }
}
</script>
